$(function(){
		$("#uploadFileDialog").dialog({
			autoOpen:false,
			modal:true,
			width:400,
			buttons:{"upload":function(){
						$('#uploadify').uploadifyUpload();
					},
					"cancel":function(){
						$('#uploadify').uploadifyClearQueue();
					},
					"close":function(){
						$(this).dialog("close");
					}
					}
		 });
		
		$(".uploadFile").live("click",function(){
			$("#uploadFileDialog").dialog("open");
		});
		 $("#uploadify").uploadify({
                'uploader': '/js/uploadify.swf',
                'script': "/product/product/upload-picture/customerId/"+customerId,
                'cancelImg': '/images/cancel.png',
                'folder': 'UploadFile',
                'queueID': 'fileQueue',
                'auto': false,
                'multi': true,
				'fileDataName':"picture",
				'fileExt':'.png;*.jpg;*.gif',
				'fileDesc':"*.png *.jpg *.gif",
				"onComplete":function(event,queueId,fileObj,response,data){
					var iWidth = $(".product-img-view").width();
					var iHeight = $(".product-img-view").height();
					$("#imagePlaceholder").remove();
					$(".uploadFile").before('<div class="product-img-view" onclick="removePicture(this)"><img src="/merchant/product/view-image/fileName/'+fileObj.name+'" width='+ iWidth +' height='+iHeight+'/><input type="hidden" name="picture[]" value="'+fileObj.name+'"/></div>');
					$("product-img-view").css("text-indent","0");
					if($(".product-img-view").length > 3){
						$("#height110").removeClass("height110");
					}
				},
				"onAllComplete":function(){
					$("#uploadFileDialog").dialog("close");
				},
				"onError":function(){
					alert('error');
				}
            });
	})

	function removePicture(obj){
		$(obj).remove();
		if($(".product-img-view").length <= 3){
			$("#height110").addClass("height110");
			if($(".product-img-view").length == 0){
				$(".uploadFile").before('<div class="product-img-view" id="imagePlaceholder">No Image</div>');
			}
		}
	}